<template>
    <div class="table-actions">
        <span @click="onEdit()" class="primary">编辑</span>
        <span @click="onDel()" class="del">删除</span>
    </div>
</template>
<script>
import { computed } from "vue";
export default {
    props: {
        msg: {
            type: String,
            default: () => "",
        },
    },
    setup(props) {
        const msg = computed({
            get: () => props.msg,
        });
        return {
            msg,
        };
    },
    methods: {
        onEdit() {
            this.$emit("edit");
        },
        onDel() {
            this.$emit("del");
        },
    },
};
</script>
<style lang="less">
.table-actions {
    span {
        margin: 0 5px;
        cursor: pointer;
        &:hover {
            text-decoration: underline;
        }
        &.primary {
            color: var(--primary-color);
        }
        &.del {
            color: #f5222d;
        }
    }
}
</style>
